<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增流程模型')" />
    <style type="text/css">
        .layui-input, .layui-textarea{width:calc(100% - 100px);}
        .layui-form-label{width:180px}
        .layui-form-select dl{margin-left:80px;min-width: calc(100% - 100px);}
        .layui-edge{margin-right:28px;}
    </style>
</head>
<body>
<form class="layui-form" id="form-model-add" style="padding: 16px 84px 16px 25px;">
    <div class="layui-form-item">
        <label class="layui-form-label"><font class="f_red">*</font>模型KEY：</label>
        <div class="layui-input-block">
            <input type="text" name="key" id="key"  lay-verify="required" autocomplete="off" placeholder="请选择" class="layui-input" readonly>
            <i class="layui-icon layui-icon-more" style="position: absolute;top:7px;left: 83%;margin-right:80px"></i>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><font class="f_red">*</font>模型名称：</label>
        <div class="layui-input-block">
            <input type="text" name="name" id="name" lay-verify="required" autocomplete="off" placeholder="请输入" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">模型分类：</label>
        <div class="layui-input-block">
            <input type="text" name="category" id="category"  autocomplete="off" placeholder="请输入" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">模型描述：</label>
        <div class="layui-input-block">
            <textarea id="description" name="description" class="layui-textarea" placeholder="请输入内容"></textarea>
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit="" lay-filter="btn_save" id="btn_save" value="保存">
    </div>
</form>
<th:block th:include="include :: footer" />
<script th:inline="javascript">
    /*<![CDATA[*/
    var prefix = ctx + "flowable/model";
    var prefix2 = ctx + "system/dictionaryformodule";
    /*]]>*/
</script>
<script>
    var $,layer,form;
    layui.use(['form','layer','jquery'], function () {
        $ = layui.$,layer = layui.layer,form = layui.form;
    });
    //点击打开model选择页
    $('#key').on('click', function () {
    	$.modal.open("功能选择", prefix2+"/select", 650, 510, function(index){
            var res = window["layui-layer-iframe" + index].callbackdata();
            if(res=="none"){
            	layer.msg("请选择！");
            }else{
            	console.log(res);
                $("#key").val(res.moduleTable);
                $('#category').val(res.menuGuid);
                if(!!res.moduleAlias){
                	$("#name").val(res.moduleAlias);
                }else{
                	$("#name").val(res.moduleName);
                }
                layer.close(index); 
            }
        });
    });
    //提交调用的方法
    function submitHandler() {
        if ($.validate.form()) {
            var data = $('#form-model-add').serializeArray();
            $.operate.save(prefix + "/addSave", data, successCallback);
        }
    }
    function successCallback(result) {
        if(result.code == "0"){
            parent.layer.closeAll();
            var url = "/modeler/index.html#/editor/" + result.data;
            parent.parent.layui.index.openTabsPage(url, '流程模型在线设计');
        }else {
            $.modal.alert(result.msg, modal_status.FAIL);
        }
    }
</script>
</body>
</html>
